<template>
 <section id="tixian">
   <div class="nr">
   			 <!-- <button class="btn-cash">提现记录</button> -->
         <div class="middle">
                <p>提现金额</p>
                <div>
                    <span>￥</span>
                    <input 
                      ref="presentMoney" 
                      v-model='money'
                      class="change-present-place animated" 
                      placeholder="大于等于1元" 
                      type="tel"/>
                </div>
                <p style="color:#999;margin-top:18px;">
                  当前余额&nbsp;&nbsp;￥{{allMoney}}&nbsp;&nbsp;&nbsp;&nbsp;
                  <span @touchend="allPresentMoney" style="color:#179EF0;">
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;全部提现
                  </span>
                </p>
                <p @click="beginPresent" style="margin-top:50px;">
                   <el-button  type="primary" style="width:100%;">提交</el-button>
                </p>
         </div>
     </div> 
  </section>
</template>
<script>
import {URL_GET_MONEY,AJAX,_layer} from '@/comm.js';
export default {
  data(){
    return ({
      allMoney:0,
      money:''
    });
  },
  created(){
    this.allMoney=this.$route.query.price;
  },
  beforeCreate: function() {
    var th=this;
    $("title").text("提现");
  },
 mounted: function() {
    setTimeout(function(){
      var h=$(window).height();
      $("#tixian").css("min-height",h+"px");
      var hh=(h- $(".nr").height())/2;
      $(".nr").css("margin-top",hh+"px");
    },500);
 },
 methods:{
    //全部提现
    allPresentMoney(){
      this.money=this.allMoney;
      $(this.$refs.presentMoney).addClass("shake");
      setTimeout(()=>{
        $(this.$refs.presentMoney).removeClass("shake");
      },300)
    },
    beginPresent(){
      let This=this;
      if(Number(this.money)<1||Number(this.money)>Number(this.allMoney)){
        _layer('提现金额有误');
        return ;
      }
      let send={
        price:this.fen(this.money),
      };
      $.post(URL_GET_MONEY,send,function(data){
          if(data.retult){
            _layer(data.message);
            This.allMoney=This.yuan(This.fen(This.allMoney)-This.fen(This.money));
            setTimeout(function(){
              WeixinJSBridge.call('closeWindow');
            },1000);
          }else{
            _layer(data.message);
          }
      });
    },
    //钱元转为分
    fen(val){
        let str=String(val);
        let point=str.indexOf('.');
        if(point!=-1){
            let zhenshu=parseInt(str.slice(0,point))*100;
            let pointAfter=str.slice(point+1);
            if(pointAfter.length==1){
                return zhenshu+parseInt(pointAfter)*10;
            }else if(pointAfter.length>=2){
                return zhenshu+parseInt(pointAfter.slice(0,1))*10+parseInt(pointAfter.slice(1,2));
            }else{
                return zhenshu;
            }
        }else{
            return parseFloat(val)*100;
        }
    },
    //钱分转为元
    yuan(val){
        let judge=String(val);
        if(judge=='undefined'||judge=='null'){
          return 0.00;
        }
        let priceStr=String(parseFloat(parseInt(val)/100));
        let index=priceStr.indexOf('.');
        if(index!=-1){
            let handle=priceStr.slice(index+1);
            if(handle.length==1){
                priceStr=priceStr+'0'
            }
        }else{
            priceStr=priceStr+'.00';
        }
        return priceStr;
    }
 }
}
</script>
<style scoped>
  .nr{
    position: relative;
    width:90%;
    margin: auto;
    background-color: white;
    border-radius: 5px;
   }
  .nr .middle{padding: 20px;}
  .btn-cash{
  	position:absolute;
  	height:25px;
  	right:0;
  	top:-10px;
  	border:none;
  	background:#f1f1f1;
  	font-size:10px;
  	color:#66b1ff;
  }
  .btn-cash:focus{
    outline:none;
  }
  .change-present-place:focus{
    outline: none;
  }
  .change-present-place::-webkit-input-placeholder{
    font-size:1.6rem;
  }
  .middle > div{
    margin-top:10px;
    border-bottom: 1px solid #f1f0f0;
    font-size:30px;
  }
  .middle > div >span{
    vertical-align: middle;
  }
  .middle > div >input{
    width:180px;
    height:40px;
    border:0px;
    vertical-align: middle;
    font-size:30px;
  }
</style>